
<%@page import="multiface.valentinorusso.jpa.Lavoro"%>
<%@page import="multiface.valentinorusso.jpa.Utente"%>
<%@page import="java.util.List"%>
<%@page import="javax.persistence.Query"%>
<%@page import="multiface.valentinorusso.jpa.File"%>
<%@page import="multiface.valentinorusso.jpa.Categoria"%>
<%@page import="javax.persistence.EntityManager"%>
<%@page import="javax.persistence.Persistence"%>
<%@page import="javax.persistence.EntityManagerFactory"%>
<%@page import="javax.persistence.EntityManagerFactory"%>
<%@page import="multiface.valentinorusso.jpa.util.PersistenceManager"%>
<%
    Utente u = (Utente) session.getAttribute("admin");
    if (u == null) {
        response.sendRedirect(multiface.web.util.ServletUtils.getBaseUrl(request) + "/admin/index.jsp?err=y");
    }
    String lids = request.getParameter("lid");
    String sez = request.getParameter("sez");
    String pag = request.getParameter("page");
    String action = request.getParameter("action");
%>

<script type="text/javascript">
    $(document).ready(function() {
        $('#uploadify').uploadify({
            'uploader': 'engine/plugin/uploadify/uploadify.swf',
            'script': 'site/center/adm/addFiles.jsp?lid=<%=lids%>',
            'folder': '/uploads',
            'cancelImg': 'engine/plugin/uploadify/cancel.png',
            'multi': true,
            'sizeLimit': 1048576*2,
            'auto' :true,
            'onComplete'  : function(event, ID, fileObj, response, data) {
                
                $.post("site/center/adm/append_image.jsp",{fid:jQuery.trim(response)},function(d){
                    $(".images").append(d);
                });
         
                //$(".images").append("<div id=\"file_"+jQuery.trim(response)+"\" onclick=\"javascript:del("+jQuery.trim(response)+")\"><img class=\"mouse\" src=\"GetImageServlet?th=y&fid="+jQuery.trim(response)+"\" height=\"96\" width=\"128\"></img></div>");
            }
        });
        $('#upload').click(function() {
            $('#uploadify').uploadifyUpload();
            return false;
        });
    });
    
    function del(fid){
        if(confirm('Eliminare la foto?')){
            $.post("ActionServlet", 
            { 
                adm:'<%=session.getId()%>',
                fid:fid,
                action:'del_file'
            },
            function(data){ 
                location.href= "index.jsp?adm=<%=session.getId()%>&page=<%=pag%>&sez=<%=sez%>&action=<%=action%>&lid=<%=lids%>";
            });
        }
    }
    
    function cover(fid){
        if(confirm('Impostare la foto come copertina del Lavoro?')){
            $.post("ActionServlet", 
            { 
                adm:'<%=session.getId()%>',
                fid:fid,
                lid:<%=lids%>,
                action:'cover_file'
            },
            function(data){ 
                location.href= "index.jsp?adm=<%=session.getId()%>&page=<%=pag%>&sez=<%=sez%>&action=<%=action%>&lid=<%=lids%>";
            });
        }
    }
    
    function img_over(fid){
        $("#del_"+fid).show();
        $("#cover_"+fid).show();
    }
    function img_out(fid){
        $("#del_"+fid).hide();
        $("#cover_"+fid).hide();
    }
</script>
<style>
    .img-single{
        float: left;
        width: 150px;
        margin-bottom: 12px;
        
    }
    .box-up{
        float: left;
        margin-top: 20px;
    }
    .mouse{

        border: 1px #ccc solid;
    }
    .mouse:hover{
        border: 1px red solid;

    }
    .img_cover{
        position: absolute;
        font-size: 16px;
        color: white;
        width: 128px;
        height: 24px;
        text-align: center;
        font-weight: bolder;
        margin-top: -24px;
        background-color: rgb(20,20,20); 
        opacity: 0.7;
        z-index: 100;

    }
    .btn-img{
        width: 128px;
        margin-top: 2px;
        font-size: 9px;
    }
    .btn-img-del{
        background-color: #fff; 
        height: 16px;
        width: 60px;
        z-index: 100;
        float: left;
        cursor: pointer;
    }
    .btn-img-cov{
        background-color: #fff; 
        height: 16px;
        width: 64px;
        z-index: 100;
        float: left;
        margin-left: 4px;
        cursor: pointer;
    }
</style>

<%
    int cid = Integer.parseInt(lids);
    //Sy_stem.out.println("image_prod.jsp - pid:" + pid);
    EntityManagerFactory emf = PersistenceManager.getInstance().getEntityManagerFactory();
    EntityManager em = emf.createEntityManager();
    Lavoro p = em.find(Lavoro.class, cid);
    em.refresh(p);
    List<File> list = p.getFileList();
%>

<div class="images">
    <%
        for (File f : list) {
            em.refresh(f);
            if (f.getCopertina()) {
    %>
    <div class="img-single" id="file_<%=f.getIdfile()%>">
        <img class="mouse" src="GetImageServlet?th=y&fid=<%=f.getIdfile()%>" height="96" width="128"></img>
        <p class="img_cover">COPERTINA</p>
        <div class="btn-img">
            <div class="btn-img-del" id="del_<%=f.getIdfile()%>" onclick="javascript:del(<%=f.getIdfile()%>)">
                <img src="engine/img/btn/del.png" width="16" height="16" /> Elimina
            </div>
        </div>
    </div>
    <%
    } else {
    %>
    <div class="img-single" id="file_<%=f.getIdfile()%>">
        <img class="mouse" src="GetImageServlet?th=y&fid=<%=f.getIdfile()%>" height="96" width="128"></img>
        <div class="btn-img">
            <div class="btn-img-del" id="del_<%=f.getIdfile()%>" onclick="javascript:del(<%=f.getIdfile()%>)">
                <img src="engine/img/btn/del.png" width="16" height="16" /> Elimina
            </div>
            <div class="btn-img-cov" id="cover_<%=f.getIdfile()%>" onclick="javascript:cover(<%=f.getIdfile()%>)">
                <img src="engine/img/btn/cover.png" width="16" height="16" /> Copertina
            </div>
        </div>
    </div>
    <%
            }
        }
    %>
</div>
<div class="box-up">
    <div style="float: left;width: 130px;"><input id="uploadify" type="file">
        <a id="upload"style="display: none" href="#">Upload</a>
    </div>
    <div style="float: left;width: 150px;">Usa il tasto CTRL per selezionare pi&ugrave immagini.</div>
</div>
<div class="box-prew" style="display: none" id="preview">
    <div class="title">Preview Image</div>
    <div id="image"></div>
</div>

<%
    em.close();
    //emf.close();
%>